/**
 * Created by Administrator on 2016/11/23.
 */

var path = require('path');
var react = require('react');
var webpack = require('webpack');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: [
	    'webpack/hot/dev-server', 
	    path.resolve(__dirname, './app/app')
    ],
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'bundle.js'
    },
    devServer:{
        contentBase: '',  //静态资源的目录 相对路径,相对于当前路径 默认为当前config所在的目录
        devtool: 'eval',
        hot: true,        //自动刷新
        inline: true,
        port: 8080
    },
    resolve: {
        extensions: ['', '.js', '.jsx'], // 后缀名自动补全
    },
	module: {
		loaders: [
			{
				test: /\.jsx?$/,
				exclude: /node_modules/,
				loader: 'babel',
				query: {
					presets: ['es2015','react']
				}
			},{
				test: /\.(png|jpg|jpeg|bmp|gif)$/,
				loader: 'url-loader?limit=8192' // 这里的 limit=8192 表示用 base64 编码 <= ８K 的图像
			},{
				test: /\.(css|less)$/, // LESS/CSS加载器
                loader: ExtractTextPlugin.extract("style", "css!less!autoprefixer") // autoprefixer 自动为CSS样式添加浏览器前缀
			},{
				test: /\.(eot|woff|svg|ttf|woff2|appcache)(\?|$)/,
                exclude: /^node_modules$/,
                loader: 'file-loader?name=[name].[ext]'
			}
		]
	},
    plugins: [
        new webpack.optimize.UglifyJsPlugin(), // 代码压缩
        new webpack.HotModuleReplacementPlugin(), // 热替换
        new webpack.optimize.CommonsChunkPlugin('common.js'), // 把所有入口节点的公共代码提取出来，生成一个common.js文件中(注意，如果没有在plugins中设置HtmlWebpackPlugin的话，需要在手动去创建common.js文件，css亦是如此，然后再index.html文件中去引入)
        new ExtractTextPlugin("[name].css"), // 将css代码抽出来到相应的css文件中，和js文件一样，也需要手动创建相应的css文件
        new HtmlWebpackPlugin({ // 设置了模板文件和目标文件，inject的作用是将css文件和js文件插入到body的底部去，hash:true，是在css和js文件后面加hash值，解决了缓存问题(如果使用了HtmlWebpackPlugin，相应的css文件和js文件会自动生成，而无需我们手动去创建)
            filename: '../index.html',
            template: './app/index.html',
            inject: 'body',
            hash: true
        })
    ]
}